import memberInfo from "@/views/society/party/partyList/memberInfo";
import baseInfo from "@/views/society/party/partyList/baseInfo";
import { rowKeys } from "@/views/society/party/store";
import { partyDetailTabDict } from "@/views/society/party/dict";
import { setOpenModalInfo } from "../store";
export const drawerConfig = ({
  handleAction,
  refreshTable,
  fetchList,
}: any) => {
  const handleReview = ({ record, type }: any) => {
    setOpenModalInfo({
      isOpenByDraw: true,
      drawCallback: refreshInfo,
    });
    handleAction({
      record,
      type,
    });
  };
  const refreshInfo = () => {
    defineDrawer.loading.value = true;
    defineDrawer.formState.isShowReviewBtnGroup = false;
    fetchList();
    handleAction({
      record: defineDrawer.formState,
      type: "detail",
      callback: () => {
        defineDrawer.formState.isShowReviewBtnGroup = false;
        defineDrawer.loading.value = false;
      },
    });
  };
  const defineDrawer = {
    components: {
      baseInfo,
      memberInfo,
    },
    drawerInstance: ref(null),
    loading: ref(false),
    visible: ref(false),
    title: ref(""),
    width: "950px",
    maskClosable: true,
    formState: reactive({
      ...rowKeys,
      tabType: 1,
      isShowGoReviewBtn: false,
      isShowReviewBtnGroup: false,
    }),
    slot: {
      extra_form_item: () => {
        const { formState, loading } = defineDrawer;
        return (
          <>
            <a-tabs v-model:activeKey={formState.tabType} style="width: 100%">
              {partyDetailTabDict.value
                .filter(
                  ({ label, value }) =>
                    formState.isShowGoReviewBtn || value === 1
                )
                .map(({ label, value }) => (
                  <a-tab-pane key={value} tab={label}>
                    {value === 1 ? (
                      <baseInfo
                        formState={formState}
                        statusLoading={loading.value}
                        onHandleAction={handleAction}
                        onRefreshTable={refreshTable}
                      />
                    ) : (
                      <memberInfo party_id={formState.id} />
                    )}
                  </a-tab-pane>
                ))}
            </a-tabs>
          </>
        );
      },
      extra: () => {
        const { formState } = defineDrawer;
        return (
          <>
            <div style="display: flex;gap: 20px;">
              {formState.isShowReviewBtnGroup ? (
                <>
                  <a-button
                    icon={renderIcon("icon-fanhui1")}
                    type="primary"
                    ghost
                    onClick={() => (defineDrawer.visible.value = false)}
                  >
                    {$t("base.back")}
                  </a-button>
                  {withDirectivePower({
                    bindingValue: "societyApi.reviewReject",
                    vNode: (
                      <a-button
                        icon={renderIcon("icon-butongguo")}
                        onClick={() =>
                          handleReview({
                            record: formState,
                            type: "review->reject",
                          })
                        }
                      >
                        {$t("base.refuse")}
                      </a-button>
                    ),
                  })}
                  {withDirectivePower({
                    bindingValue: "societyApi.reviewPass",
                    vNode: (
                      <a-button
                        icon={renderIcon("icon-tongguo1")}
                        type="primary"
                        onClick={() =>
                          handleReview({
                            record: formState,
                            type: "review->pass",
                          })
                        }
                      >
                        {$t("base.pass")}
                      </a-button>
                    ),
                  })}
                </>
              ) : (
                <a-button
                  icon={renderIcon("icon-tubiao_tijiao")}
                  type="primary"
                  onClick={() => (defineDrawer.visible.value = false)}
                >
                  {$t("base.ok")}
                </a-button>
              )}
            </div>
          </>
        );
      },
    },
  };
  return defineDrawer;
};
